define(()=>{
    return function (valu,bto,cont,data){
        console.log(data)
        let str='';
            data.forEach((val,idx)=>{
                let aa='';
               let b=val.proName
                if(b.indexOf(valu)!=-1){
					console.log(data[idx].imgs)
                    data[idx].imgs.forEach(val1=>{
                        aa+=`<img src='${val1}' 
                        class='small'>`
                    })
                    str+=`<dl class='yige'>
                    <dt><a href="./detail.html?${val.proId}" class='dbig'><img src="${val.img}" alt="" class='big' abc='1'></a></dt>
                    <dd class='li'>${aa}</dd>
                    <dd>
                        <span>&yen;<i  class="nowprice">${val.price}</i></span>
                        <del>&yen;<i>${val.price/0.8}</i></del>
                        
                    </dd>
                    <dd>
                    <a href="">${val.proName}</a>
                    </dd>
                    <dd dataid="${val.proId}">
                    <input type="text" value=1 class="listnum">
                    <div>
                        <i id='jia'></i>
                        <em id='jian'></em>
                    </div>
                    <p class="addlocal">加入购物车</p>
                    </dd>
                </dl>`
                    }
                   
             })
        // }
        if(!str){
           str=`<p>对不起，没有该商品`
        }
        cont.html(str)
        const length=document.querySelectorAll('.yige').length
        $('.pagination').pagination(length,{
            items_per_page:20,
		num_display_entries:3,
		num_edge_entries:2,
		current_page: 5,
        callback:(abc)=>{
            console.log(abc)
        }
        })
        console.log($('.pagination'))
        // class Page{
        //     constructor(ops){
        //         console.log('fenye')
        //         this.pageCont = ops.pageCont;
        //         this.listCont = ops.listCont;
        //         this.res=ops.res;
        //         this.num=20;
        //         this.index=0;
        //         console.log(this.res)
        //         // this.length=document.querySelectorAll('.yige').length;
        //         this.createPage();
        //     }
        //     createPage(){
        //         this.pageCont.pagination(this.res.length,{
        //             items_per_page:this.num,
        //             callback:(aaa)=>{
        //                 this.index=aaa;
        //                 this.createList();
        //             }

        //         })
        //     }
        //     createList(){
        //         let str=''
        //         for(let id=this.index*this.num;id<(this.index+1)*this.num;id++){
        //             if(id<this.res.length){
        //                 str+=`<dl class='yige'>
        //                 <dt><a href="./xiangqing.html?id" class='dbig'><img src="${this.res[id].img}" alt="" class='big' abc='1'></a></dt>
        //                 <dd class='li'></dd>
        //                 <dd>
        //                     <span>&yen;<i>${this.res[id].price}</i></span>
        //                     <del>&yen;<i>${this.res[id].price/0.8}</i></del>
                            
        //                 </dd>
        //                 <dd>
        //                 <a href="">${this.res[id].proName}</a>
        //                 </dd>
        //                 <dd>
        //                 <input type="text" value=1>
        //                 <div>
        //                     <i id='jia'></i>
        //                     <em id='jian'></em>
        //                 </div>
        //                 <p>加入购物车</p>
        //                 </dd>
        //             </dl>`
        //             }
        //         }
        //         this.listCont.html(str)
        //     }

        // }
        
    class BigImgMove{
        constructor(){
            this.sImg=document.querySelectorAll('.small');
            this.box=document.querySelectorAll('.li');
            this.bigImg=document.querySelectorAll('.big')
            this.oldImg=[]
            this.addEvent()
        }
        addEvent(){
            const that = this
            for(let j=0;j<this.box.length;j++){
                let ind=j;
                // console.log(j)
               this.div=this.box[j].children
               this.oldImg[j]=this.bigImg[j].src;
                for(let i=0;i<this.div.length;i++){
                    // console.log(ind)
                    this.div[i].index=j;
                    
                    console.log( this.div[i].index)
                    this.div[i].onmouseover=function(){
                        console.log(123)
                        // this.oldImg=that.bigImg[this.index]
                        // console.log(this.oldImg)
                        that.bigImg[this.index].src=this.src
                    }
                    this.div[i].onmouseout=function(){
                        that.bigImg[this.index].src=that.oldImg[this.index]
                    }
                }
            }
            console.log(this.oldImg.length)
        }
        changeImg(eve){


        }
    }
  new BigImgMove()
//   new Page({
//       listCont:cont,
//     pageCont:$('.pagination'),
//       num:4,
//       res:data

//   })
      

    }
})
